<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>nav制作</title>
        <style type="text/css">
            *{
                margin:0;
                padding:0;
            }
            .box{
                background:rgba(0,0,0,0.6);

            }

            ul{
                margin:0 auto;
                width:1000px;

            }
            li{
                list-style: none;
                display:inline-block;
                vertical-align: middle;
                font-size:14px;
                padding:10px;
            }
            ul img{
                height:60px;
                padding:1 px 6px;

            }
            ul li:nth-of-type(2){
                padding-left:30px;
            }
            ul li:nth-of-type(8){
                padding-right:30px;
            }
            a{
                color:#fff;
                text-decoration: none;
            }
            a:hover{
                color:blue;
            }
            .btn a{
                border:1px solid gold;
                border-radius:20px;
                padding:5px 20px;
                color:gold;
                text-decoration: none;
            }
            .btn a:hover{
                background: gold;
                font-weight: bold;
                color:darkgoldenrod;
            }

            li:hover img{
                background: gold;
                border:1px solid gold;
                border-radius:30px;
            }


        </style>
    </head>
    <body>
        <div class="box">
            <ul>
                <li><a href="#"><img src="images/logo.png"/></a></li>
                <li><a href="#">功能特权</a></li>
                <li><a href="#">游戏特权</a></li>
                <li><a href="#">生活特权</a></li>
                <li><a href="#">会员活动</a></li>
                <li><a href="#">成长体系</a></li>
                <li><a href="#">年费专区</a></li>
                <li><a href="#">超级会员</a></li>
                <li class="btn"><a href="#">登录</a></li>
                <li class="btn"><a href="#">开通超级会员</a></li>
            </ul>
        </div>
    </body>
</html>